const Persons = ({ persons, deletePerson }) => (
    <>
        {persons.map((person) => (
            <Person key={person.id} person={person} deletePerson={deletePerson} />
        ))}
    </>
);

const Person = ({ person, deletePerson }) => {
    return (
        <div>
            name={person.name} number={person.number}
            <button onClick={() => deletePerson(person.id)}>delete</button>
        </div>
    );
};

export default Persons;
